<template>
    <van-field
            :required="option.required"
            v-if="option.editable"
            v-model="value"
            :label="option.title"
            :placeholder="option.title"
            left-icon="edit"
            autosize
            clearable
    />
    <van-cell v-else :title="option.title" :label="value"></van-cell>
</template>

<script>
    export default {
        props: ["option"],
        name: "text.vue",
        data(){
            return {
                value: this.init()
            }
        },
        watch:{
            value(nv){
                this.option.value = this.value
            }
        },
        methods:{
            init(){
                return ""
            }
        },
        mounted() {
            this.value = this.option.value || ""
        }
    }
</script>

<style scoped>
    .van-cell{
        text-align: left;
    /*    border-bottom: 1px solid #ddd;*/
    }
</style>
